import React from 'react'
import styles from "../assets/styles/model.module.css"

export default function Model(props) {
    const closeModel = ()=>{
        props.close(false)
    }
    if (props.visible) {
        return (
            // 整个弹框遮罩层
            <div className={styles.modelOption}>
                {/* 弹框的内容区域 */}
                <div className={styles.modelContent}>
                    <h3>{props.modelTitle}</h3>
                    <div>
                        {/*  内容区域 */}
                        {/* 插槽就是占位符，页面中占位 */}
                        {props.children}
                    </div>
                    <button onClick={closeModel}>关闭</button>
                </div>
            </div>
        )
    }else{
        return null
    }

}
